<template>
	<view class="traveler">
		<view class="traveler_item" v-for="(item) in list" @click="toUser(item)">
			<view class="item_left">
				<image :src="item.avatar_url" mode=""></image>
			</view>
			<view class="item_right">
				<view class="right_t">
					<!-- 华胥星球-苍龙 -->
					{{item.nick_name}}
				</view>
				<view class="right_c">
					<!-- 返朴归源 -->
					{{item.level_id != 0?item.grade.level_name:'普通用户'}}
				</view>
				<view class="right_b">
					{{item.introduce?item.introduce:'无'}}
					<!-- 帕累托法则，亦称二八法则，是指大部分的44885552233 -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			list:{
				type:Array,
				default:() => []
			}
		},
		data() {
			return {

			}
		},
		methods: {
			getList() {
				
			},
			toUser(item) {
				uni.navigateTo({
				  url: `/pages/home/home?user_id=${item.user_id}`,
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.traveler {
		width: 100%;
		padding: 0 30rpx;
		box-sizing: border-box;

		.traveler_item {
			width: 100%;
			display: flex;
			box-sizing: border-box;
			margin-top: 48rpx;
			.item_left {
				width: 136rpx;
				height: 136rpx;

				image {
					width: 100%;
					height: 100%;
					border-radius: 50%;
				}
			}

			.item_right {
				// flex: 1;
				width: 539rpx;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				padding-left: 24rpx;
				.right_t {
					font-size: 30rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #EEEEEE;
				}

				.right_c {
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #ADADAD;
				}

				.right_b {
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;
					font-size: 26rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #ADADAD;
					
				}
			}
		}
	}
</style>